.codeLine {
  counter-increment: codeLineNumber;
}

.codeLine:before {
  position: absolute;
  left: 0px;
  width: var(--line-number-width);
  box-sizing: border-box;
  padding-right: 5px;
  content: counters(codeLineNumber, ".") " ";
  text-align: right;
}

#code-node {
  padding-left: var(--line-number-width) !important;
}

/* Background of number bar */
#code-node:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  color: var(--line-number-color, black);
  background-color: var(--line-number-background-color, rgba(0, 0, 0, 0.04));
  border-radius: var(--code-node-border-radius, 7px) 0 0
    var(--code-node-border-radius, 7px);
  width: calc(var(--line-number-width, 45px) - 7px);
}

/* Quick fix for jumping line heights.
  I'll just leave it here since it probably does not hurt to have it. */
#code-node .codeLine:after {
  content: " ";
  visibility: hidden;
}
